<template>
	<view>
		<view style="background-color:#1cafff;display: flex;" >
			<view>
				<text style="margin-top: 16rpx; margin-left: 20rpx;">余额：</text>
			</view>
			<view style="margin-left: 550rpx;">
				<image src="../../static/iconfont/wenhao.png" @tap="wenhaoTis" style="height: 40rpx;width: 40rpx; margin-left: 20rpx;"></image>
			</view>
			
		</view>
		<view style="display: flex;justify-content: center;align-items: center; flex-direction: column; height: 250rpx; background-color:#1cafff;">
			<text style="margin-top: 16rpx; font-size: 100rpx;">￥{{userAmt}}.00 元</text>
		</view>
		<view style="background-color:#1cafff; height: 50rpx;" >
			<text> </text>
		</view>
		<view style="margin-top: 16rpx; margin-left: 16rpx;">
			<text style="font-weight: bold;"> 选择金额： </text>
		</view>
		<view class="addMoney">
			<view class="moneyLaut" >
					<view class="money" v-for="(item,index) in moneyAll" @click="addmoneyValue" :key="index"
						:class="'index ' + (id == item.id ? 'active' : 'default')" :data-item="item">
						{{item.money}}<text class="selfinputtext">元</text>
						
					</view>
			</view>
			<view class="paymentmethod" style="margin-top: 20rpx;width: 90%;margin-left: 5%; height:140rpx;">
				<view style="margin-top: 10rpx;display: flex;align-items: center;width: 100%;">
					<image  src="/static/iconfont/wxlogo.png" style="width: 70rpx; height: 70rpx;"></image>
					<text  style="margin-left: 16rpx;font-size: 40rpx;">微信支付</text>
					<text v-if="rechargeAmount !== null" style="margin-left: 60rpx;">{{rechargeAmount}} 元</text>	
				</view>
				<view style="margin-left:400rpx;margin-top: 16rpx;" >
					<text style="color:#1cafff;" @tap="paymentMethod">更换充值方式></text>
				</view>
			</view>
			
			<view @tap="confirmrRecharge" class="querencz" style="border-radius: 16rpx;align-items: center; display: flex;justify-content: center;margin-top: 60rpx;width: 90%;margin-left: 5%; height:80rpx; background-color: #1cafff;">
					<text style="color: white;">确认充值</text>
			</view>
			
		</view>
		
		

	</view>
</template>

<script>
	const app = getApp();
	var urlPrefix = app.globalData.urlPrefix;
	export default {
		data() {
			return {
				userAmt:0,
				id:null,
				rechargeAmount:null,
				moneyAll: [{
							id:1,
							money: 100
						}, {
							id:2,
							money: 200
						}, {
							id:3,
							money: 300
						}, {
							id:4,
							money: 400
						}, {
							id:5,
							money: 500
						}, {
							id:6,
							money: 600
						}, ]
			}
		},
		   
		onLoad(options) {
			var userId = uni.getStorageSync('userId');
			var token = uni.getStorageSync('token');
			let that = this;
				uni.request({
					url: urlPrefix + '/api/applet/myInfo/getUserAmt?userId=' + userId,
					method: 'GET',
					header: {
						'content-type': 'application/json',
						'token': token
					},
					success: function (res) {
						uni.hideLoading();
						that.setData({
						   userAmt:res.data.datas
						});
					}
				});
		},
		methods: {
			confirmrRecharge:function(res){
				if (this.rechargeAmount == null) {
				    uni.showToast({
				        title: '请选择充值金额',
				        icon: 'none',
				        duration: 2000
				    });
				    return;
				}
				
				
				
				 let that = this;
				 var userId = uni.getStorageSync('userId');
				 uni.request({
				     url: urlPrefix + '/api/app/recharge/instRechrge?id=' + this.id + '&userId=' + userId + "&money="+this.rechargeAmount,
				     method: 'GET',
				     header: {
				         'content-type': 'application/json',
				         'token': uni.getStorageSync('token')
				     },
				     success: function (res) {
				         if (res.data.resp_code == 0) {
							 
				 		        uni.hideLoading();
						   
								uni.requestPayment({	
									
								     "provider": "wxpay", 
									 "orderInfo": {
										 "appid":  res.data.datas.appid,  // 微信开放平台 - 应用 - AppId，注意和微信小程序、公众号 AppId 可能不一致
										 "noncestr":  res.data.datas.noncestr, // 随机字符串
										 "package": "Sign=WXPay",        // 固定值
										 "partnerid": res.data.datas.partnerid,      // 微信支付商户号
										 "prepayid": res.data.datas.prepayid, // 统一下单订单号 
										 "timestamp":res.data.datas.timestamp,        // 时间戳（单位：秒）
										 "sign": res.data.datas.sign// 签名，这里用的 MD5/RSA 签名
									 },
									 success(res) {
										 // uni.navigateBack({
										 //             delta: 1
										 // });
										 uni.navigateTo({
										     url: '/pages/myinfo/myinfo',
										 });
									 },
									 fail(e) {
										 uni.showToast({
										     title: '支付失败',
										     icon: 'none',
										     duration: 2000
										 });
									 }
								})
						
				           
				         }else {
				 			uni.showToast({
				 			    title: res.data.resp_msg,
				 			    icon: 'none',
				 			    duration: 2000
				 			});
				 		}
				     
					}
				});
			},
			paymentMethod:function(res){
				uni.showToast({
				    title: '当前仅支持微信充值',
				    icon: 'none',
				    duration: 2000
				});
				
				// 显示提示框
				// uni.showActionSheet({
				//   itemList: ['微信','支付宝'],
				//   success: function (res) {
				//     if (!res.cancel) {
				//       if (res.tapIndex === 0) {
				//         // 用户点击了按钮1
				//       } else if (res.tapIndex === 1) {
				//         // 用户点击了按钮2
				//       }
				//     } else {
				//       // 用户点击了取消
				//     }
				//   },
				//   fail: function (res) {
				//     // 处理错误情况
				//   }
				// });
			},
			addmoneyValue:function(res) {
				this.id = res.currentTarget.dataset.item.id;
				this.rechargeAmount = res.currentTarget.dataset.item.money;	
			},
			wenhaoTis:function(res) {
				uni.showModal({
				    title: '提示',
				    content: '1.当前充值金额仅限于本APP内使用。2.每天充值金额累计最高为2000元。3.当前暂不支持提现功能。4.当前仅支持通过微信支付方式充值。如有疑问请致电管理员',
				    success: function (res) {
				       
				    }
				});
			},
		}
	}
</script>

<style>
@import './recharge.scss';
</style>
